画像の横に文章




　　　【　画像と文字の位置関係　その２　】


昨日の日記で使ったタグは、画像の横に
１行だけ表示する時に使うタグです。
今日は、少し長い文章を入れる場合のタグの紹介です。


●画像と文字の間に余白を入れていません。


画像の右に文字を入れたい場合に
使っています。
これは文字と画像の間に
余白を入れていません。
タグの許可されている掲示板などで
良く使われているようです。


●画像を表示させるタグに　align="left"　を加えます。　

<img src="画像のアドレス" align="left">
ここから文章を書きます。

※余白がないので、ちょっと
　うるさい感じがします。　


●画像の左右に余白を入れてみました。


上の画像と比較してみてください。
画像の左右に余白を入れてみました。
こっちの方がすっきりして
見えると思いますが・・・。
私はこっちを良く使います。
余白のサイズはお好みで！！


●　上のタグにhspace="30"を加えます。

<img src="画像のアドレス" align="left" hspace="30">
ここから文章を書きます。　

※数字が大きくなると、余白も大きくなります。

※１行に入れる文字が多過ぎると、改行されてしまう
　場合があるので、確認しながらやってみてください。


●　画像の左側に文字を表示させます。


私はあまり使いませんが、
使い方によっては
効果的かな？
日記やページ欄では
画像と文字の間の余白が
大き過ぎるようです。
　

● 　"align="left"　を　"align="right"　にします。

<img src="画像のアドレス" align="right">
ここから文章を書きます。


　

© Rakuten Group, Inc.